<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title>报警详情</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover" />
		<link href="css/mui.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/mui.picker.css" />
		<link rel="stylesheet" type="text/css" href="css/mui.depicker.css" />
		<link rel="stylesheet" type="text/css" href="css/comment.css" />
		<link rel="stylesheet" type="text/css" href="css/eqDetail.css" />
		<link rel="stylesheet" type="text/css" href="css/alarm.css" />
	</head>

	<body>
		<div id="app">
			<header class="mui-bar mui-bar-nav gradient_normal">
				<div style="height: 20px;"></div>
				<div class="mui-action-back mui-pull-left mui-icon mui-icon-arrowleft"></div>
				<h1 class="mui-title">报警详情</h1>
			</header>
			<section class="eqd_title" style="margin-top: 66px;">
				<img src="images/teq06.png">
				<strong>报警信息</strong>
			</section>
			<section class="eqd_rol">
				<div class="item clearfix">
					<span class="fl">设备编号：</span>
					<span class="fr">{{alarmList.DeviceId}}</span>
				</div>
				<div class="item clearfix">
					<span class="fl">设备名称：</span>
					<span class="fr">{{alarmList.W_Title}}</span>
				</div>
				<div class="item clearfix">
					<span class="fl">报警级别：</span>
					<span class="fr">{{alarmList.W_Level}}</span>
				</div>
				<div class="item clearfix">
					<span class="fl">报警时间：</span>
					<span class="fr">{{alarmList.W_Time}}</span>
				</div>
				<div class="item clearfix">
					<span class="fl">结束时间：</span>
					<span class="fr">{{alarmList.W_EndTime}}</span>
				</div>
				<div class="item clearfix">
					<span class="fl">状态：</span>
					<span class="fr normal">{{alarmList.Status}}</span>
				</div>
			</section>
			<section class="alDebtm">
				<div class="btnBox" v-if="alarmList.Status=='未处理'">
					<button type="button" class="mui-btn mui-btn-primary alarm_btn">信息反馈</button>
				</div>
				<div class="box" v-if="alarmList.Status=='已处理'">
					<div class="title">反馈信息</div>
					<div class="info">
						<div class="item">
							<span class="">反馈人员</span>
							<span class="">{{alarmList.W_User}}</span>
						</div>
						<div class="item">
							<span class="">反馈时间</span>
							<span class="">{{alarmList.W_EndTime}}</span>
						</div>
						<div class="item">
							<span class="itemLf">反馈信息</span>
							<span class="itemRt">已解决</span>
						</div>
					</div>
				</div>
			</section>
			<div class="modal_bg" style="display: none;">
				<div class="modal_box">
					<div class="mui-icon mui-icon-closeempty"></div>
					<div class="title">处理反馈</div>
					<div class="modal_content">
						<input type="text" class="modal_time" value="" placeholder="日期" readonly="readonly"/>
						<textarea class="modal_text" placeholder="反馈描述" style="height: 2rem;">
							
						</textarea>
					</div>
					<button type="button" class="modal_btn">提交</button>
				</div>
			</div>
		</div>
		<script src="js/mui.js"></script>
		<script src="js/mui.picker.js" type="text/javascript"></script>
		<script src="js/mui.dtpicker.js" type="text/javascript"></script>
		<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/rem.js" type="text/javascript" charset="utf-8"></script>
		<script src="https://cdn.jsdelivr.net/npm/vue@2.6.0"></script>
		<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
		<script type="text/javascript">
			var app=new Vue({
				el:"#app",
				data:{
					url: "http://112.54.80.235:8038",
					DevNo: '',
					alarmList:{}
				},
				mounted(){
					mui.init();
					mui.plusReady(function() {
						//关闭等待框
						plus.nativeUI.closeWaiting();
						var self = plus.webview.currentWebview();
						app.DevNo = self.proid;
						//获取警报信息
						axios.get(app.$data.url + '/actionapi/Users/GetSJWarning', {
								params: {
									//DevNo: app.$data.DevNo,
									startime:0,
									endtime:0,
									level:0
								}
							})
							.then(function(response) {
								var data = response.data.data;
								for(var i = 0; i < data.length; i++){
									if (data[i].DeviceId == self.proid) {
										app.$data.alarmList =data[i];
									}
								}
							})
							.catch(function(error) {
								plus.nativeUI.alert("GetSJWarning接口有误", function(e) {
									console.log(e.index);
								}, "信息提示", '确定');
							});
						//时间
						$('.modal_time').click(function() {
							var strPicker = new mui.DtPicker({
								type: 'date'
							});
							strPicker.show(function(e) {
								$('.modal_time').val(e)
							})
						});
						//点击反馈按钮
						$('.alarm_btn').on("tap",function(){
							$('.modal_bg').show()
						});
						//反馈提交按钮
						$('.modal_btn').on("tap",function(){
							var time=$('.modal_time').val();
							var text=$('.modal_text').val();
							$('.modal_bg').hide()
							axios.get(app.$data.url + '/actionapi/Users/GetFanKuiXinxi', {
									params: {
										//DevNo: app.$data.DevNo,
										deviceNo:app.$data.DevNo,
										fankuiren:0,
										fankuineirong:text
									}
								})
								.then(function(response) {
									if(response.data.Code==1){
										plus.nativeUI.alert("反馈成功", function(e) {
											console.log(e.index);
										}, "信息提示", '确定');
									}else{
										plus.nativeUI.alert("反馈失败", function(e) {
											console.log(e.index);
										}, "信息提示", '确定');
									}
								})
								.catch(function(error) {
									plus.nativeUI.alert("GetFanKuiXinxi接口有误", function(e) {
										console.log(e.index);
									}, "信息提示", '确定');
								});
						});
						//modal-关闭按钮
						$('.modal_box .mui-icon-closeempty').on("tap",function(){
							$('.modal_bg').hide();
						})
					})
				}
			});
		</script>
	</body>

</html>
